import { ElRadio } from 'element-plus';
import { PropType } from 'vue';
import './style.scss';

export const MciRadio = defineComponent({
  name: 'MciElRadio',
  props: {
    label: {
      type: [String, Number, Boolean],
      default: ''
    },
    text: {
      type: String,
      default: ''
    },
    mode: {
      type: String as PropType<TVitalModeType>,
      default: ''
    },
    type: {
      type: String as PropType<'normal' | 'simple'>,
      default: 'normal'
    }
  },
  setup(props) {
    const modeComputed = computed(() => props.mode);

    return {
      modeComputed
    };
  },
  render() {
    return (
      <ElRadio
        class={['mci-radio', { 'is-simple-radio': this.type === 'simple' }]}
        disabled={this.modeComputed === 'view'}
        label={this.label}>
        {{
          default: () => this.$slots.default?.() || this.text
        }}
      </ElRadio>
    );
  }
});
